<template>
	<view class="conter">
		<header-box :title="title"></header-box>

		<view class="conter-text">
			 <!-- v-for="(item,index) in list" :key="index" -->
			<view class="bgc">
				<view class="box-btn">
					<view class="" style="margin-bottom: 30rpx;">
						单位名称
					</view>
					<view class="">
						<!-- <input type="text" :value="item.name"  placeholder="散客" placeholder-style="font-size: 28rpx" /> -->
						<input type="text"  v-model="name" placeholder="散客" placeholder-style="font-size: 28rpx" />
					</view>
				</view>
				<view class="box-btn">
					<view class="" style="margin-bottom: 30rpx;">
						联系电话
					</view>
					<view class="">
						<!-- <input type="text" :value="item.phone"  placeholder="请输入联系电话" placeholder-style="font-size: 28rpx" /> -->
						<input type="number" maxlength="11" v-model="phone" placeholder="请输入联系电话" placeholder-style="font-size: 28rpx" />
					</view>
				</view>
				<view class="box-btn">
					<view class="" style="margin-bottom: 30rpx;">
						备注
					</view>
					<view class="">
						<!-- <input type="text" :value="item.memo"  placeholder="请填写备注" placeholder-style="font-size: 28rpx" /> -->
						<input type="text"  v-model="memo" placeholder="请填写备注" placeholder-style="font-size: 28rpx" />
					</view>
				</view>
			</view>
		</view>

		<!-- bg-gradual-green -->
		<view class="add ">
			<view class="remove" @click="showRemove = true">
				删除
			</view>
			<view class="add-class bg-gradual-green" @click="addTextList">
				保存
			</view>
		</view>



		<!-- 删除的弹框 -->
		<u-popup
			v-model="showRemove"
			mode="center"
			width="580rpx" height="140px"
			border-radius="10">
			<view class="tilte-text">提示</view>
			<view class="" style="font-size: 28rpx; color: #999999; text-align: center;">
				确定要删除吗？
			</view>
			<view class="btn-bor">
				<text class="left-bor" @click="showRemove= false">取消</text>
				<text @click="removeUnit">确定</text>
			</view>
		</u-popup>
	</view>
</template>

<script>
	import headerBox from '../../components/header/header.vue'

	export default {
		components: {
			headerBox
		},
		data() {
			return {
				title: '资料修改',
				showRemove: false, // 删除的弹层
				id: '',
				name: '',
				phone: '',
				memo: '',
				list: [],
			}
		},
		onLoad(e) {
			console.log(e)
			this.id = e.item
			this.stockList(this.id)
		},
		methods: {
			async stockList(id) {
				const { data: res} = await this.$u.post("api/jinxiao.Company/index?id=" + id);
				this.name = res[0].name
				this.phone = res[0].phone
				this.memo = res[0].memo
			},
			
			// 确定修改保存
			async addTextList () {
				if (this.name == '' || this.phone == '' ) return this.$tools.msg('内容不能为空')
				const res = await this.$u.post("api/jinxiao.Company/edit?id=" + this.id + "&name=" + this.name + "&phone=" + this.phone + "&memo=" + this.memo);
				uni.navigateBack({
					delta: 1
				})
			},
			
			// 删除数据
			async removeUnit () {
				const res = await this.$u.post("api/jinxiao.Company/delete?id=" + this.id);
				this.showRemove = false
				this.$tools.msg(res.msg)
				uni.navigateBack({
					delta: 1
				})
				
			}
		}
	}
</script>

<style lang="scss" scoped>
	.conter {
		width: 100%;
		height: 100%;
		position: relative;
	}

	.conter-text {
		padding: 30rpx;

		.bgc {
			width: 100%;
			height: 500rpx;
			padding: 0 30rpx;
			border-radius: 10rpx;
			background-color: #FFFFFF;

			.box-btn {
				width: 100%;
				height: 144rpx;
				font-size: 30rpx;
				padding: 20rpx 0;
				border-bottom: 1rpx solid #F0F0F0;
			}
		}
	}

	.add {
		position: fixed;
		bottom: 30rpx;
		left: 50%;
		width: 100%;
		height: 90rpx;
		line-height: 90rpx;
		transform: translateX(-50%);
		text-align: center;
		color: #FFFFFF;
		display: flex;
		justify-content: space-around;
		font-size: 32rpx;

		.remove {
			width: 40%;
			height: 90rpx;
			border-radius: 45rpx;
			background-color: #CCCCCC;
		}

		.add-class {
			width: 40%;
			height: 90rpx;
			border-radius: 45rpx;
		}
	}
	
		
		.tilte-text {
			color: #333;
			width: 100%;
			height: 100rpx;
			line-height: 100rpx;
			text-align: center;
			font-size: 32rpx;
		}
		
		.btn-bor {
			width: 90%;
			height: 113rpx;
			color: #7278EC;
			margin: 0 auto;
			line-height: 113rpx;
			margin-top: 40rpx;
			display: flex;
			justify-content: space-around;
			border-top: 1rpx solid #EEEEEE;
			
			.left-bor {
				border-right: 1rpx solid #EEEEEE;
			}
			
			text {
				display: inline-block;
				width: 40%;
				height: 113rpx;
				text-align: center;
			}
		}
</style>
